<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <div th:replace="common/fragments :: meta"></div>
    <!-- load css -->
    <div th:replace="common/fragments :: css"></div>

    <title>employee - view</title>
</head>

<body>

<div class="container-fluid">
    <div class="row">
        <div class="col-md-2">
        </div>
        <div class="col-md-8">
            <table class="table table-striped" id="employee-table">
                <thead>
                <tr>
                    <th><input id="select_all"
                               name="roleIds"
                               type="checkbox"/>
                    </th>
                    <th>#</th>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>SN</th>
                    <th>Address</th>
                    <th>Department</th>
<!--                    <th>Roles</th>-->
                    <th>JoinTime</th>
                </tr>
                </thead>
                <tbody>
                <tr th:each="employee : ${employees}">
                    <td>
                        <input class="checkbox_select" name="ids"/>
                    </td>
                    <td th:text="${employee.id}"></td>
                    <td th:text="${employee.firstName}"></td>
                    <td th:text="${employee.lastName}"></td>
                    <td th:text="${employee.SN}"></td>
                    <td th:text="${employee.address.city} + ' ' + ${employee.address.state} + ' ' + ${employee.address.zipCode}"></td>
                    <td th:text="${employee.department.name}"></td>
<!--                    <td th:text="employee.roles.name"></td>-->
                    <td th:text="${employee.joinedTime}"></td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="col-md-2">
        </div>
    </div>
</div>

<div th:replace="common/fragments :: copy-right"></div>

</body>

<!-- load js -->
<div th:replace="common/fragments :: js"></div>
<div th:replace="common/dataTable :: js"></div>
<script th:src="@{/custom/js/employee/table.js}"></script>

</html>